 
<title>jQuery实现图片的左右旋转效果 &gt;&gt; </title>
<link rel="stylesheet" href="css/common.css" type="text/css" />
<style type="text/css">
.rot_box{width:512px; margin:0 auto;}
.image_box{text-align:center;}
</style>
<script type="text/javascript" src="js/jquery-1.2.6.pack.js"></script>
<script type="text/javascript" src="js/jquery.rotate.js"></script>
<script type="text/javascript">
$(function(){
	var rot = 0;
	$("#rotRight").click(function(){
		if(rot === 360){
			rot = 0;
		}
		rot += 90;
		$("#rotImg").rotate(90);
	});
	$("#rotLeft").click(function(){
		if(rot === -360){
			rot = 0;
		}
		rot -= 90;
		$("#rotImg").rotate(-90);
	});		   
});
</script>
</head>

<body>
<div class="zxx_out_box">
    <div class="zxx_in_box">
        <div class="zxx_main_con">
			<div class="zxx_test_list">
            	<div class="rot_box">
                	
					<div id="imgBox" class="image_box">
                    	<img id="rotImg" src="images/mm1.jpg" />
                    </div>                    <p class="fix f9 mb10"><a id="rotLeft" class="l" href="javascript:void(0);">&lt;&lt;向左转</a><a id="rotRight" class="r" href="javascript:void(0);">向右转&gt;&gt;</a></p>                    
                </div>
            </div>
        </div>
        
    </div>
</div>
<div class="zxx_ad_left fixed">

</div>
</div>
</body>
</html>